[motion-next.git] /

<md-card ngCloak>
  <md-toolbar
    class="md-table-toolbar md-default table-header blue-bg"
    ng-class="{'h-128' : vm_voice.isSearchBarVisible === true}"
  >
    <div class="md-toolbar-tools" layout="row" layout-align="center center">
      <span class="md-subhead" translate="DASHBOARDS.ABANDONEDQUEUECALLS"
        >ABANDONED QUEUE CALLS</span
      >
      <ms-search-bar
        on-search="vm_voice.query.filter = query"
        on-collapse="vm_voice.onSearchBarCollapse()"
        on-expand="vm_voice.onSearchBarExpand()"
        query="vm_voice.query.filter"
        debounce="300"
        direction="down"
        icon-color="white-fg"
      ></ms-search-bar>
      <div flex></div>
      <ms-quick-filter
        filters="vm_voice.quickFilters"
        query="vm_voice.query"
        search="vm_voice.getAbandonedCalls()"
      ></ms-quick-filter>
      <md-button
        class="md-icon-button reload-list"
        ng-click="vm_voice.refresh && vm_voice.refreshAbandonedCalls($event)"
        aria-label="Reload"
        translate
        translate-attr-label="DASHBOARDS.RELOAD"
      >
        <md-icon md-font-icon="icon-reload"></md-icon>
        <md-tooltip
          ng-if="vm_voice.showTooltip"
          md-visible="vm_voice.showTooltip"
        >
          {{'DASHBOARDS.CLICKRELOAD' | translate}}</md-tooltip
        >
      </md-button>
    </div>
  </md-toolbar>
  <md-table-container>
    <table md-table md-progress="vm_voice.promise">
      <thead
        md-head
        md-order="vm_voice.query.sort"
        md-on-reorder="vm_voice.getAbandonedCalls"
      >
        <tr md-row>
          <th md-column md-order-by="id">{{'DASHBOARDS.ID' | translate}}</th>
          <th md-column md-order-by="calleridname">
            {{'DASHBOARDS.FULLNAME' | translate}}
          </th>
          <th md-column md-order-by="calleridnum">
            {{'DASHBOARDS.PHONE' | translate}}
          </th>
          <th md-column md-order-by="queue">
            {{'DASHBOARDS.QUEUE' | translate}}
          </th>
          <th md-column md-order-by="queuecallerabandonAt">
            {{'DASHBOARDS.ABANDONAT' | translate}}
          </th>
          <th md-column md-order-by="disposition">
            {{'DASHBOARDS.DISPOSITION' | translate}}
          </th>
          <th md-column md-order-by="secondDisposition">
            {{'DASHBOARDS.SECOND_LEVEL_DISPOSITION' | translate}}
          </th>
          <th md-column md-order-by="thirdDisposition">
            {{'DASHBOARDS.THIRD_LEVEL_DISPOSITION' | translate}}
          </th>
          <th md-column>{{'DASHBOARDS.RESERVED' | translate}}</th>
          <th md-column md-order-by="lastAssignedTo">
            {{'DASHBOARDS.LASTASSIGNEDTO' | translate}}
          </th>
          <th md-column width="10px"></th>
        </tr>
      </thead>
      <tbody md-body>
        <tr md-row ng-hide="vm_voice.abandonedCalls.rows.length">
          <td md-cell colspan="12">
            <div layout="row" layout-align="center center">
              <span translate="VOICE.NO_AVAILABLE_INFO">No Available Info</span>
            </div>
          </td>
        </tr>
        <tr md-row ng-repeat="abandonedCall in vm_voice.abandonedCalls.rows">
          <td md-cell class="id">{{abandonedCall.id}}</td>
          <td md-cell class="firstName">{{abandonedCall.calleridname}}</td>
          <td md-cell class="phone">
            <!-- click to call directive -->
            <ms-click-to-call
              target="abandonedCall.calleridnum"
              license="vm_home.license"
              disabled="abandonedCall.lastAssignedTo !== vm_voice.currentUser.name"
            >
            </ms-click-to-call>
            <!--  / click to call directive -->
          </td>
          <td md-cell class="list">
            {{vm_voice.queuesMap[abandonedCall.queue]}}
          </td>
          <td md-cell class="list">
            {{abandonedCall.queuecallerabandonAt ?
            (abandonedCall.queuecallerabandonAt | formatdate) : undefined }}
          </td>
          <td md-cell class="list">{{ abandonedCall.disposition }}</td>
          <td md-cell class="list">{{ abandonedCall.secondDisposition }}</td>
          <td md-cell class="list">{{ abandonedCall.thirdDisposition }}</td>
          <td md-cell class="actions">
            <md-switch
              no-margin
              ng-if="abandonedCall.lastAssignedTo === vm_voice.currentUser.name || !abandonedCall.lastAssignedTo"
              ng-disabled="vm_voice.disable[abandonedCall.id]"
              ng-model="abandonedCall.assigned"
              aria-label="reserved"
              ng-change="vm_voice.reserved(abandonedCall)"
            >
            </md-switch>
          </td>
          <td md-cell class="list">{{abandonedCall.lastAssignedTo}}</td>
          <td md-cell class="actions">
            <md-menu
              ng-if="abandonedCall.lastAssignedTo === vm_voice.currentUser.name"
            >
              <md-button
                class="md-icon-button"
                aria-label="More"
                translate
                translate-attr-aria-label="DASHBOARDS.MORE"
                ng-click="$mdOpenMenu($event)"
              >
                <md-icon md-font-icon="icon-dots-vertical"></md-icon>
              </md-button>
              <md-menu-content width="1">
                <md-menu-item>
                  <md-button
                    ng-click="vm_voice.dispose(abandonedCall)"
                    class="text-capitalize"
                    translate="DASHBOARDS.DISPOSE"
                    >Dispose
                  </md-button>
                </md-menu-item>
              </md-menu-content>
            </md-menu>
          </td>
        </tr>
      </tbody>
    </table>
  </md-table-container>
  <md-table-pagination
    md-limit="vm_voice.query.limit"
    md-limit-options="[10, 15, 20, 50, 100, 250]"
    md-page="vm_voice.query.page"
    md-total="{{vm_voice.abandonedCalls.count}}"
    md-on-paginate="vm_voice.getAbandonedCalls"
    md-page-select
  ></md-table-pagination>
</md-card>